<template>
    <div>

      <van-col v-for="(item, index) in list" :key="index">
        <div class="Item_wrapper">
          <router-link :to="path">
            <div class="pic">
              <van-image
                src="https://images.pexels.com/photos/3690511/pexels-photo-3690511.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500"
                alt=""
              />
            </div>
            <slot name="content">

            </slot>
          </router-link>
          <div class="content">
            <van-row><p style="font-size: 0.5rem">专业模板木材专业地板直营</p> </van-row>

            <p style="font-size: 0.7rem">专业模板木材专业地板</p>
            <p style="font-size: 0.7rem">石家庄专卖</p>
            <van-row type="flex" justify="space-between">
              <van-col class="info1">
                <p style="color: red">市场价 <span style="font-size: 1rem">￥388</span></p>
              </van-col>

            </van-row>
          </div>


        </div>
        <p>&nbsp</p>
      </van-col>

    </div>
</template>

<script>
    export default {
        name: "ItemGoodsDetails",
      props:{
        path:String,
        marker:String
      },
      data(){
        return{
          list:5,
        }
      },


    }
</script>

<style scoped>
  .content{
    padding: 0.9rem;
  }
  .info1 {
    display: flex;
    margin-top: 2.2vw;
  }
  .info1 p {
    font-size: 3.733vw;
    height: 4.4vw;
    line-height: 4.4vw;
    margin-right: 1.6vw;
    color: #777777;
  }
  .info1 .distance {
    font-size: 3.2vw;
    color: #000;
  }
  .info1 .i {
    font-size: 4.4vw;
  }
  .title {
    margin: 2.2vw 0vw;
    color: #333;
  }
  .Item_wrapper {
    width: 46.666vw;
    margin: 0vw 1.6vw;
    background-color: #ffffff;
    margin-bottom: 2.667vw;
  }
  .Item_wrapper .pic {
    width: 42.666vw;
    height: 42.666vw;
    overflow: hidden;
    border-radius: 4vw;
    position: relative;
  }
  .marker {
    padding: 0.533vw 1.333vw;
    background-color: #d34a4a;
    color: #ffffff;
    font-size: 13.999px;
    line-height: 6.667vw;
    position: absolute;
  }
  .content {
    text-align: left;
  }
</style>
